<script>
import {View} from "@element-plus/icons-vue";
import router from "@/router/router.js";

export default {
  name: "home",
  components: {View},
  data() {
    return {}
  },
  methods: {

    forum() {
      router.push('/forum')
    },
    goods() {
      router.push('/goods')
    },
    answer() {
      router.push('/answer')
    },
    carousel() {
      router.push('/carousel')
    },
    user() {
      router.push('/user')
    },
    orders() {
      router.push('/orders')
    },
    comment() {
      router.push('/comment')
    },
    recyclers() {
      router.push('/recyclers')
    },
  },
  created() {
    router.push('/forum')
  }
}
</script>

<template>
  <div class="common-layout">

    <el-header id="home-head">
      <img src="../../assets/icon/logo.png" alt="logo" id="logo">
      <el-text id="title">校园二手物品交易平台</el-text>
    </el-header>
    <!--    -->
  </div>
  <el-container class="information">
    <!-- 左侧选择栏 -->
    <el-aside width="100px">
      <el-menu default-active="1" class="el-menu-vertical-demo">
        <el-menu-item index="1" @click="forum">论坛管理</el-menu-item>
        <el-menu-item index="2" @click="goods">商品管理</el-menu-item>
        <el-menu-item index="3" @click="answer">论坛回答</el-menu-item>
        <el-menu-item index="4" @click="carousel">轮播图管理</el-menu-item>
        <el-menu-item index="5" @click="user">用户管理</el-menu-item>
        <el-menu-item index="6" @click="orders">订单管理</el-menu-item>
        <el-menu-item index="7" @click="comment">评论管理</el-menu-item>
        <el-menu-item index="8" @click="recyclers">二手回收商</el-menu-item>
      </el-menu>
    </el-aside>

    <!-- 右侧内容显示区域 -->
    <el-main style="background-color: #aedfdf;">
      <router-view/>
    </el-main>
  </el-container>


</template>

<style scoped>
.information {
  height: 90vh
}

#home-head {
  display: flex;
  height: 80px;
  background-color: #313d4b;
  border-radius: 8px;
}

#logo {
  margin-top: 20px;
  height: 40px;
  padding-left: 15px;
  padding-right: 20px;
}

#title {
  color: #e1dede;
  margin: auto 0;
  font-size: 30px;
}
</style>